<#macro menu>
    <li class="current_page_item"><a href="/freemarker/control/index.html">Home</a></li>
    <li><a href="/freemarker/control/aboutme.html">About Me</a></li>
    <li><a href="/freemarker/control/ofbiz.html">About Ofbiz</a></li>
    <li><a href="/freemarker/control/gallery.html">Galley</a></li>
    <li><a href="/freemarker/control/contact.html">Contact Me</a></li>
</#macro>

<#macro copyright>
    <p>Copyright (c) 2008 Sitename.com. All rights reserved. Design by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a>.</p>
</#macro>

<#macro content>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Arthropod   by Free CSS Templates</title>
<link href="/freemarker/anthropod/style.css" rel="stylesheet" type="text/css" media="screen" />
<script type="text/javascript" src="/freemarker/anthropod/jquery/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="/freemarker/anthropod/jquery/jquery.gallerax-0.2.js"></script>
<style type="text/css">
@import "/freemarker/anthropod/gallery.css";
</style>
</head>
<body>
<div id="wrapper">
    <div id="header">
        <div id="logo">
            <h1><a href="#">Arthropod </a></h1>
            <p> design by <a href="http://www.freecsstemplates.org/">Free CSS Templates</a></p>
        </div>
    </div>
    <!-- end #header -->
</#macro>

<#macro category>
    <h2>Categories</h2>
        <ul>
            <li><a href="#">Aliquam libero</a></li>
            <li><a href="#">Consectetuer adipiscing elit</a></li>
            <li><a href="#">Metus aliquam pellentesque</a></li>
            <li><a href="#">Suspendisse iaculis mauris</a></li>
            <li><a href="#">Urnanet non molestie semper</a></li>
            <li><a href="#">Proin gravida orci porttitor</a></li>
        </ul>   
</#macro>

<#macro blogroll>
    <h2>Blogroll</h2>
        <ul>
            <li><a href="#">Aliquam libero</a></li>
            <li><a href="#">Consectetuer adipiscing elit</a></li>
            <li><a href="#">Metus aliquam pellentesque</a></li>
            <li><a href="#">Suspendisse iaculis mauris</a></li>
            <li><a href="#">Urnanet non molestie semper</a></li>
            <li><a href="#">Proin gravida orci porttitor</a></li>
            <li><a href="#">Suspendisse iaculis mauris</a></li>
            <li><a href="#">Urnanet non molestie semper</a></li>
        </ul>
</#macro>

<#macro archives>
    <h2>Archives</h2>
        <ul>
            <li><a href="#">Aliquam libero</a></li>
            <li><a href="#">Consectetuer adipiscing elit</a></li>
            <li><a href="#">Metus aliquam pellentesque</a></li>
            <li><a href="#">Suspendisse iaculis mauris</a></li>
            <li><a href="#">Urnanet non molestie semper</a></li>
            <li><a href="#">Proin gravida orci porttitor</a></li>
            <li><a href="#">Suspendisse iaculis mauris</a></li>
            <li><a href="#">Urnanet non molestie semper</a></li>
        </ul>   
</#macro>

<#macro gallery>
    <div id="gallery"> 
        <img class="output" src="/freemarker/anthropod/images/img04.jpg" alt="" />
        <div id="thumbnail-bg">
            <ul class="thumbnails">
                <li><img class="active" src="/freemarker/anthropod/images/img04.jpg" title="Monument Valley" alt="" width="604" height="375" onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=70" /></li>
                <li><img src="/freemarker/anthropod/images/img05.jpg" title="Honey Bee" alt="" width="100" height="75"  onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=70" /></li>
                <li><img src="/freemarker/anthropod/images/img06.jpg" title="Cup of Coffee" alt="" width="100" height="75"  onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=70" /></li>
                <li><img src="/freemarker/anthropod/images/img07.jpg" title="Grand Tetons" alt="" width="100" height="75"  onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=70" /></li>
            </ul>
        </div>
        <br class="clear" />
    </div>
    <script type="text/javascript">

        $('#gallery').gallerax({
            outputSelector:         '.output',                  // Output selector
            thumbnailsSelector:     '.thumbnails li img',       // Thumbnails selector
            captionSelector:        '.caption'                  // Caption selector
        });

    </script>
</#macro>

<#assign liquam="Mauris vitae nisl nec metus placerat perdiet est. Phasellus dapibus semper consectetuer hendrerit.">

<#assign cats = {"cat1":"Aliquam libero", "cat2":"Consectetuer adipiscing elit", "cat3":"Metus aliquam pellentesque", "cat4":"Suspendisse iaculis mauris"}>